<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<title>我的</title>
		<!--标准mui.css-->
		<link rel="stylesheet" href="../css/mui.min.css">
		<script src="../js/mui.min.js"></script>
		<script src="../js/mui.picker.min.js"></script>
		<script src='../js/jquery.min.js'></script>
		<link rel="stylesheet" href="../css/mui.picker.min.css">
		<style>
			.mui-btn{
				width: 100%
			}
			
			.radio_inline{
                display: inline-block;
                width: 65%;
            }
            .radio_inline label{

                width: 20%;
                padding-left: 40px;
                padding-right: 40px;
            }
            .radio_inline input[type=radio]{
                width: 15%;             
                right: auto;
            }
            
            #stardate{
            	margin-right: 20px;min-width:160px;text-align: right;
            }
		</style>
	</head>
	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">编辑资料</h1>
		</header>

		<div class="mui-content">
			<br>
			<div class="mui-input-row">
				<input type="text" placeholder="请输入姓名" id="name">
			</div>

			<div class="mui-input-row ">
				<label>性别</label>
				<span class="radio_inline mui-radio">
					<input name="radio1" type="radio" id="radio_man" value="男">
					<label for="radio_man">男</label>
					<input name="radio1" type="radio" id="radio_woman" value="女">
					<label for="radio_woman">女</label>
				</span>
			</div>

			<div class="mui-input-row">
				<input type="text" placeholder="请输入班级" id="class">
			</div>

			<div class="mui-input-row">
				<input type="text" placeholder="请输入大学" id="university">
			</div>

			<div class="mui-input-row">
				<input type="text" placeholder="请输入学院" id="academy">
			</div>

			<div class="mui-input-row">
				<input type="text" placeholder="请输入专业" id="major">
			</div>

			<div class="mui-input-row">
				<input type="text" placeholder="请输入省份" id="province">
			</div>

			<div class="mui-input-row">
				<label>出生日期</label>
				<span id='stardate' class="mui-pull-right">请选择</span>
				<!-- <input type="hidden" name="rideStartTime" placeholder="生日" id='birthday'/> -->


			</div>
			<br>
			<button class="mui-btn mui-btn-primary" id="submit">提交</button>
		</div>

	</body>
	<script>
		var birthday;
		document.getElementById("stardate").addEventListener('tap', function() {
			var dDate = new Date();
			var picker = new mui.DtPicker({
				type: "date",
				beginDate: new Date(1900, 01, 01, 0, 0),
				endDate: new Date()
			});
			picker.show(function(rs) {
				console.log(rs)
				var timestr = rs.text;
				document.getElementById("stardate").innerHTML = timestr;
				birthday = timestr;
				picker.dispose();
			});
		});

		var user_id;
		mui.plusReady(function() {
			user_id = plus.storage.getItem('uID');
			init();
		})
		// init();
		//初始化数据
		function init() {
			mui.ajax({
				url: 'http://120.27.247.180:8080/School/users/showMessage',
				type: "post",
				async: false,
				data: {
					"uID": user_id
				},
				dataType: "json",
				contentType: "application/x-www-form-urlencoded; charset=utf-8",
				jsonp: "jsoncallback",
				success: function(data) {
					jQuery("#name").val(data.users.userName);
					if (data.users.sex == '女')
						jQuery("#radio_woman").attr("checked", "checked");
					else
						jQuery("#radio_man").attr("checked", "checked");
					jQuery("#class").val(data.users.className);
					jQuery("#university").val(data.users.school);
					jQuery("#academy").val(data.users.academy);
					jQuery("#major").val(data.users.major);
					jQuery("#province").val(data.users.province);

				},
				error: function() {
					mui.toast("网络异常");
				}
			});
		}

		document.getElementById("submit").addEventListener('tap', function(e) {
			var obj = {
				"uID": user_id,
				"userName": jQuery("#name").val(),
				"className": jQuery("#class").val(),
				"school": jQuery("#university").val(),
				"academy": jQuery("#academy").val(),
				"major": jQuery("#major").val(),
				"province": jQuery("#province").val(),
				"birthday": birthday,
				"sex": jQuery('input[name="radio1"]:checked').val()
			};

			mui.ajax({
				url: 'http://120.27.247.180:8080/School/users/updateMessage',
				type: "post",
				data: obj,
				dataType: "jsonp",
				contentType: "application/x-www-form-urlencoded; charset=utf-8",
				jsonp: "jsoncallback",
				success: function(data) {
					data = JSON.parse(data);
					if (data['suc']) {
						mui.toast("修改成功");
					} else {
						mui.toast("修改失败");
					}
				},
				error: function() {
					mui.toast("服务器异常，请稍后再试");
				}
			});
		});
	</script>
</html>
